<template>
  <div>
    <van-nav-bar
      title="个人中心"
      left-text="返回"
      left-arrow
      @click-left="onClickLeft"
      fixed
    />

    <!-- 登录头像 -->
    <van-row class="container">
      <van-col span="8">
        <div class="Headportrait">
          <img
            src="https://pic.baike.soso.com/ugc/baikepic2/29420/20211219212442-498112227_jpeg_750_500_79470.jpg/0"
            alt=""
          />
          
        </div>
      </van-col>
      <van-col span="8" style="margin-top:1rem"><span style="font-size: 0.7rem;color: aliceblue;">{{user.name}}</span></van-col>
    </van-row>
    <!-- 收货和评价 -->
    <div style="margin-top: 0.5rem">
      <van-cell title="全部订单" is-link @click="tobuyed_order" />
      <van-row ype="flex" justify="center">
        <van-col span="12" class="centerimg" @click="tobuyed_order">
          <img src="@/assets/shouhuo.png" alt="" />
          <div style="margin-top: 0.2rem">待收货</div>
        </van-col>
        <van-col span="12" class="centerimg" @click="tobuyed_order">
          <img src="@/assets/pingjia.png" alt="" />
          <div style="margin-top: 0.2rem">待评价</div>
        </van-col>
      </van-row>
    </div>
    <div style="margin-top: 1rem">
      <van-cell title="我的收货地址" is-link @click="toaddressList" />
    </div>
    <Tabbar></Tabbar>
  </div>
</template>

<script>
export default {
 data() {
   return {
       user: JSON.parse(localStorage.getItem('user')),
   }
 },
  methods: {
    onClickLeft() {
      this.$router.back();
    },
    tobuyed_order() {
      this.$router.push("/buyed_order");
    },
    toaddressList() {
      this.$router.push("/addressList");
    },
  },
};
</script>

<style scoped>
.container {
  background: linear-gradient(rgb(113, 152, 231), rgb(156, 173, 197));
  margin-top: 1rem;
}
.Headportrait {
  background-color: rgb(0, 68, 255);
  margin: 0.8rem;
  border-radius: 20%;
  overflow: hidden;
}
.centerimg {
  overflow: hidden;
  text-align: center;
}
.centerimg img {
  height: 0.8rem;
  width: 0.8rem;
}
</style>